<!--
 * @Description: 其他持有字段
 * @Version: 1.0
 * @Autor: chwg
 * @Date: 2024-01-16 19:11:31
 * @LastEditors: chwg
 * @LastEditTime: 2024-01-16 19:11:31
-->
<template>
  <div class="hold-fields">
    <div class="flex-style">
      <div class="hold-fields-item hold-profit-loss flex-style">
        <div class="hold-fields-label flex-auto field-cell">
          持有损益（万元）
        </div>
        <div class="hold-fields-val flex-auto field-cell">
          <jy-input v-model="holdProfitLoss" placeholder="请输入内容" class="normal-input"></jy-input>
        </div>
      </div>
      <div class="hold-fields-item hold-annualized-return flex-style">
        <div class="hold-fields-label flex-auto field-cell">
          持有期年化收益率
        </div>
        <div class="hold-fields-val flex-auto field-cell">
          <jy-input v-model="holdAnnualizedReturn" placeholder="请输入内容" class="normal-input"></jy-input>

        </div>
      </div>
    </div>
  </div>
</template>
  
  <script>
export default {
  components: {},
  props: {
    holdProfitLoss: {
      type: String,
      default: '2121212',
    },
    holdAnnualizedReturn: {
      type: String,
      default: '4121232',
    },
  },
  data() {
    return {}
  },
  watch: {},
  methods: {},
  mounted() {},
}
</script>
  
  <style lang="less" scoped>
.hold-fields {
  width: 100%;

  .hold-fields-item {
    height: 28px;
  }
  .hold-fields-label {
    background: #eff5ff;
    border: 1px solid #eff5ff;
  }
  .hold-fields-val {
    border: 1px solid #f0f0f0;
  }
  .hold-profit-loss {
    flex: 1;
  }
  .hold-annualized-return {
    flex: 1;
  }
  .flex-style {
    display: flex;
    align-items: center;
  }
  .flex-auto {
    flex: 1;
  }
  .field-cell {
    height: 28px;
    line-height: 28px;
    padding: 0 4px;
  }
}
</style>
  